@import "common/_reset.scss";
@import "common/_header-ByZkx.scss";
@function p($px) {
    @return $px/2*1px;
}

@mixin img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

$bdcolor:#cdccd0;

.mobile{
    height: 100%;
    position: relative;
    background-image: url(../img/allbg.png);
}

section {
    
    /*删除或者分享*/
    .delete-or-share {
        display: flex;
        align-items: center;
        height: p(70);
        background-color: #e7e7e7;
        justify-content: space-around;
        li {
            width: p(305);
            height: p(50);
            border: 1px solid #1074ae;
            text-align: center;
            line-height: p(50);
            border-radius: p(5);
            a {
                i {
                    color: #1074ae;
                    font-size: p(24);
                }
            }
        }
    }
    /*商品*/
    .goods {
        background-color: #fff;
        li {
            width: 100%;
            height: p(185);
            border-top: p(1) solid #cdccd0;
            border-bottom: p(1) solid #cdccd0;
            display: flex;
            align-items: center;
            .img-box {
                flex-grow: 3.0;
                display: flex;
                align-items: center;
                justify-content: center;
                a {
                    // flex-grow: 6.12;
                    width: p(115);
                    height: p(114);
                    display: block;
                    position: relative;
                    overflow: hidden;
                    img {
                        width: 100%;
                        @include img;
                    }
                }
            }
            .text {
                flex-grow: 7;
                height: p(161);
                h2 {
                    font-size: p(26);
                    color: #5c5c5c;
                    height: p(45);
                    line-height: p(45);
                }
                .price-remove {
                    height: p(73);
                    display: flex;
                    justify-content: space-between;
                    align-items: flex-end;
                    >span {
                        font-size: p(26);
                        color: #eb7575;
                        font-weight: bold;
                        margin-bottom: p(15);
                    }
                    a {
                        font-size: p(24);
                        margin-right: p(15);
                        color: #eb7575;
                        text-align: center;
                        i {
                            font-size: p(46);
                            color: #eb7575;
                            font-weight: bold;
                            display: block;
                        }
                        span{
                            vertical-align: top;
                        }
                    }
                }
                /*按钮*/
                >button{
                    position: absolute;
                    width: p(130);
                    height: p(43);
                    border: p(1) solid #1074ae;
                    font-size: p(24);
                    color: #5c5c5c;
                    margin-left: p(182);
                    background-color: #fff;
                    border-radius: p(5);
                    i{
                        color: #950000;
                    }
                }
            }
        }
    }

    /*帮助建议*/
    .suggests{
        width: 100%;
        height: p(301);
        margin-top: p(82);
        display: flex;
        border-top: p(1) solid $bdcolor;
        justify-content: space-around;
        align-items: center;
        background-color: #e7e7e7;
        position: absolute;
        bottom: 0;
        /* 帮助者 */
        .helper{
            width: p(60);
            text-align: center;
            align-self: flex-start;
            margin-top: p(12);
            .img-box{
                width: 100%;
                padding-top: 100%;
                position: relative;
                overflow: hidden;
                img{
                    width: 100%;
                    @include img;
                }
            }
            p{
                font-size: p(24);
                color: #5c5c5c;
                margin-top: p(10);
            }
        }
        /* 帮助内容 */
        .text{
            // flex-grow: 8.2;
            width: p(525);
            height: p(280);
            display: flex;
            flex-wrap: wrap;
            align-content: space-between;
            /* 帮助标题 */
            h3{
                /*width: p(525); */
                width: 100%;
                height: p(37);
                border: p(1) solid $bdcolor;
                line-height: p(37);
                padding-left: p(12);
                font-size: p(24);
                color: #383838;
                background-color: #fff;
                border-radius: p(5);
            }
            .suggest-main{
                width: 100%;
                height: p(233);
                background-color: #fff;
                position: relative;
                border-radius: p(5);
                border: p(1) solid $bdcolor;
                p{
                    font-size: p(24);
                    color: #383838;
                    line-height: p(30);
                    text-align: justify;
                    padding: p(12);
                }
                i{
                    position: absolute;
                    bottom: p(12);
                    right: p(12);
                    font-size: p(24);
                    color: #383838;
                }
            }
        }
    }
}